const path = require('path')
const IS_PROD = process.env.NODE_ENV === 'production'
const { version } = require('./package.json');
const CompressionPlugin = require('compression-webpack-plugin')
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
function resolve(dir) {
  return path.join(__dirname, dir)
}
module.exports = {
  publicPath: './',
  outputDir: 'another_ui',
  assetsDir: 'static',
  lintOnSave: true,
  runtimeCompiler: true, // 是否使用包含运行时编译器的 Vue 构建版本
  productionSourceMap: false, // 关闭生产环境的 source map
  css: {
    extract: false,
    // 向所有 Sass 样式传入全局变量
    loaderOptions: {
      sass: {
        // @ 是 src 的别名
        prependData: `@import "@/assets/styles/common.scss"; @import "@/assets/styles/_var.scss";`,
      }
    }
  },
  devServer: {
    // eslint-loader警告配置
    client: {
      overlay:false
    },
  },
  configureWebpack: config => {
    const plugins = []
    if (IS_PROD) {
      plugins.push(new CompressionPlugin({
        test: /\.js$|\.html$|\.css$|\.jpg$|\.jpeg$|\.png/, // 需要压缩的文件类型
        threshold: 10240, // 归档需要进行压缩的文件大小最小值，10K以上的进行压缩
        filename: '[path][base].gz',
        algorithm: 'gzip',
        minRatio: 0.8, // 只有压缩率小于这个值的资源才会被处理
        deleteOriginalAssets: false // 是否删除原文件
      }))

      // 打包分析
      plugins.push(new BundleAnalyzerPlugin({
        analyzerMode: 'server',
        analyzerHost: '127.0.0.1',
        analyzerPort: 9527,
        reportFilename: 'report.html',
        defaultSizes: 'parsed',
        openAnalyzer: true, // 打开报告
        generateStatsFile: false, // 生成stats.json
        statsFilename: 'stats.json',
        statsOptions: null,
        logLevel: 'info'
      }))

      // 在js文件头部添加版权说明
      const bannerText = `Copyright © Another 版本号：${version} 打包时间：${new Date().toLocaleString()}`;
      plugins.push(new webpack.BannerPlugin(bannerText))
    }
    config.plugins = [...config.plugins, ...plugins]
  },
  chainWebpack: config => {
    config.plugins.delete('prefetch-index');

    // 别名
    config.resolve.alias.set('@', resolve('src'))

    // 封装svg-icon 将多个svg打包为一个雪碧图
    config.module.rule('svg').exclude.add(resolve('src/assets/svgIcons')).end()
    config.module
      .rule('icons')
      .test(/\.svg$/)
      .include.add(resolve('src/assets/svgIcons'))
      .end()
      .use('svg-sprite-loader')
      .loader('svg-sprite-loader')
      .options({
        symbolId: 'icon-[name]'
      })
      .end()

    // 分包
    // config.when(IS_PROD, _config => {
    //   _config.optimization.splitChunks({
    //     chunks: 'all',
    //     cacheGroups: {}
    //   })
    // })

    config
      .when(process.env.NODE_ENV === 'development',
        config => config.devtool('cheap-source-map')
      )

    // 防止多页面打包卡顿
    config.plugins.delete("named-chunks");
  },
  transpileDependencies: []
}
